<div class="progress-container">
  <d-progress [percentage]="30" [percentageText]="'30%'" [showContent]="showContentConfig" [isDynamic]="false"></d-progress>
</div>
<div class="progress-container">
  <d-progress [percentage]="85" [strokeColor]="'#fac20a'" [strokeWidth]="16" [showContent]="customContentConfig" [isDynamic]="false">
    <ng-template [dPosition]="'center'">
      <div class="overflow-ellipsis" [title]="text">{{ text }}</div>
    </ng-template>
  </d-progress>
</div>
<div class="progress-container">
  <d-progress [percentage]="percentage" [strokeColor]="'#50d4ab'" [strokeWidth]="16" [showContent]="true">
    <ng-template [dPosition]="'outer'" let-percentage="percentage">
      <div class="success-box">
        <span *ngIf="showSuccess" class="icon-position icon-right"></span>
      </div>
    </ng-template>
  </d-progress>
</div>
